window.onload = function () {
  var banner = document.getElementById("banner");
  var box = document.getElementById("box");
  var Left = document.getElementById("left");
  var Right = document.getElementById("right");
  var i = 0;
  var point = document.getElementById("point").children;
  var timer = setInterval(function () {
    banner.style.left = -650 * i + "px";
    for (var t = 0; t < point.length; ++t) {
      point[t].style.background = "white";
    }
    point[i].style.background = "red";

    i++;
    if (i == 5) i = 0;
  }, 2000);
  box.onmouseover = function () {
    clearInterval(timer);
  };
  box.onmouseout = function () {
    timer = setInterval(function () {
      banner.style.left = -650 * i + "px";
      for (var t = 0; t < point.length; ++t) {
        point[t].style.background = "white";
      }
      point[i].style.background = "red";
      i++;
      if (i == 5) i = 0;
    }, 2000);
  };
  Left.onclick = function () {
    i--;
    if (i == -1) i = 4;

    banner.style.left = -650 * i + "px";
    for (var t = 0; t < point.length; ++t) {
      point[t].style.background = "white";
    }
    point[i].style.background = "red";
  };

  Right.onclick = function () {
    banner.style.left = -650 * i + "px";
    for (var t = 0; t < point.length; ++t) {
      point[t].style.background = "white";
    }
    point[i].style.background = "red";

    i++;
    if (i == 5) i = 0;
  };
  for (var j = 0; j < point.length; ++j) {
    point[j].setAttribute("index", j);
    point[j].onclick = function () {
      var a = this.getAttribute("index");
      banner.style.left = -650 * a + "px";
      for (var k = 0; k < point.length; ++k) {
        point[k].style.background = "white";
      }
      this.style.background = "red";
    };
  }

  var reback = document.querySelector(".bisideBut");

  //动画函数的封装，obj是动画对象，target是目标位置，callback是回调函数，即定时器结束时调用实参里面的函数
  function animate(obj, target, callback) {
    //先在执行定时器之前清除一次定时器，防止多次连续点击动画按钮时出现动画效果加快的现象
    clearInterval(obj.times);
    obj.times = setInterval(function () {
      //obj相当于是对象，则obj.times就是给对象增加属性，这样避免了使用var开辟若干的内存空间
      //先计算动画的步长 （目标位置-当前距离）/10 使之每一次触发定时器时移动的步长依次减小，实现类似匀减速的运动效果
      var step = (target - window.pageYOffset) / 10;
      step = step > 0 ? Math.ceil(step) : Math.floor(step);
      //判断如果盒子移动到目标位置时就停止定时器并执行回调函数，若没有回调函数就不需要执行
      if (window.pageYOffset == target) {
        clearInterval(obj.times);
        callback && callback();
      }
      //调用scroll函数
      window.scroll(0, window.pageYOffset + step);
    }, 20);
  }

  //点击返回顶部时调用动画函数优雅滚回顶部，滚动对象是window
  reback.addEventListener("click", function () {
    animate(window, 0);
  });

  let onloads = document.querySelector(".onloadFootBox1");
  for (let i = 0; i < onloads.children.length; i++) {
    onloads.children[i].children[0].addEventListener("mouseover",function(){
      for (let j = 0; j < onloads.children.length; j++) {
        onloads.children[j].children[1].style.display = "none";
        onloads.children[j].children[0].style.color="black";
      }
      onloads.children[i].children[1].style.display = "block";
      this.style.color = "#ff4000";
    });

    // onloads.children[i].addEventListener("monseout",function(){
    //     // for(var j=0;j<onloads.children.length;j++)
    //     //     onloads.children[i].style.display="none";
    //      this.style.diplay="none";
    // })
  }

  //滚轮滑到一定距离显示固定定位的输入框区域
  var getScorll = document.querySelector(".middleArear");
  var isShow = document.querySelector(".fixedInput");

  window.addEventListener("scroll", function () {
    if (window.pageYOffset >= getScorll.offsetTop)
      isShow.style.display = "flex";
    else isShow.style.display = "none";
  });
};
